		<?php $this->load->view('layout/lib_chart');?>
		
		
		<?php 
			$maxheight=$row["sum_assured_death"];
			if ($row["sum_assured_disability"] > $maxheight)$maxheight = $row["sum_assured_disability"];
			if ($row["sum_assured_critical_illness"] > $maxheight)$maxheight = $row["sum_assured_critical_illness"];
			$pit=$row["policy_incepted"]+$row["policy_term"];
			$policy_incepted	=	date('Y');//$row["policy_incepted"];
			$maxheight+=($maxheight*0.1);
		?>
		<!-- 2. Add the JavaScript to initialize the chart on document ready -->
		<script type="text/javascript">

			var chart1,chart2,chart3,chart4;
			$(document).ready(function() {
				chart1 = new Highcharts.Chart({
					chart: {
						renderTo: 'container1',
						defaultSeriesType: 'spline',
						inverted: true,
						width: 400,
						style: {
							//margin: '0 auto'
						}
					},
					title: {
						text: 'Protection'
					},
					subtitle: {
						//text: 'According to the Standard Atmosphere Model'
					},
					xAxis: {
						reversed: false,
						title: {
							enabled: true,
							text: 'SAD'
						},
						labels: {
							formatter: function() {
								return this.value +'';
							}
						},
						maxPadding: 0.05,
						gridLineWidth: 0,
						//showLastLabel: true,
						min : 0,
						max : <?php echo $maxheight;?>
					},
					yAxis: {
						title: {
							text: 'PI + t'
						},
						labels: {
							formatter: function() {
								return this.value + '';
							}
						},
						lineWidth: 2,
						gridLineWidth: 0,
						min : <?php echo $policy_incepted;?>,
						tickWidth:1,
						gridLineDashStyle:'ShortDash',
						minorGridLineDashStyle: 'Solid',
						minorGridLineWidth: 1,
						plotLines: [{
			                value: <?php echo $row["maturity_year"];?>,
			                width: 1,
			                color: 'green',
			                dashStyle: 'dash',
			                label: {
			                    //text: 'Latest value',
			                    align: 'right',
			                    y: 12,
			                    x: 0
			                }
			            }]
						
					},
					legend: {
						enabled: false
					},
					tooltip: {
						formatter: function() {
							return ''+
								this.y +' / '+ this.x +'';
						}
					},
					plotOptions: {
						spline: {
							marker: {
								enable: false
							}
						}
					},
					series: [{
						name: 'Temperature',
						data: [[<?php echo $row["sum_assured_death"];?>, <?php echo $policy_incepted;?>], [<?php echo $row["sum_assured_death"];?>, <?php echo $pit;?>]]
					}]
				});

				chart2 = new Highcharts.Chart({
					chart: {
						renderTo: 'container2',
						defaultSeriesType: 'spline',
						inverted: true,
						width: 400,
						style: {
							//margin: '0 auto'
						}
					},
					title: {
						text: 'Protection'
					},
					subtitle: {
						//text: 'According to the Standard Atmosphere Model'
					},
					xAxis: {
						reversed: false,
						title: {
							enabled: true,
							text: 'SADI'
						},
						labels: {
							formatter: function() {
								return this.value +'';
							}
						},
						maxPadding: 0.05,
						//showLastLabel: true,
						min : 0,
						max : <?php echo $maxheight;?>
					},
					yAxis: {
						title: {
							text: 'PI + t'
						},
						labels: {
							formatter: function() {
								return this.value + '';
							}
						},
						lineWidth: 2,
						gridLineWidth: 0,
						min : <?php echo $policy_incepted;?>,
						gridLineDashStyle:'ShortDash',
						minorGridLineDashStyle: 'Solid',
						minorGridLineWidth: 1,
						plotLines: [{
			                value: <?php echo $row["maturity_year"];?>,
			                width: 1,
			                color: 'green',
			                dashStyle: 'dash',
			                label: {
			                    //text: 'Latest value',
			                    align: 'right',
			                    y: 12,
			                    x: 0
			                }
			            }]
					},
					legend: {
						enabled: false
					},
					tooltip: {
						formatter: function() {
							return ''+
								this.y +' / '+ this.x +'';
						}
					},
					plotOptions: {
						spline: {
							marker: {
								enable: false
							}
						}
					},
					series: [{
						name: 'Temperature',
						data: [[<?php echo $row["sum_assured_disability"];?>, <?php echo $policy_incepted;?>], [<?php echo $row["sum_assured_disability"];?>, <?php echo $pit;?>]]
					}]
				});

				chart3 = new Highcharts.Chart({
					chart: {
						renderTo: 'container3',
						defaultSeriesType: 'spline',
						inverted: true,
						width: 400,
						style: {
							//margin: '0 auto'
						}
					},
					title: {
						text: 'Protection'
					},
					subtitle: {
						//text: 'According to the Standard Atmosphere Model'
					},
					xAxis: {
						reversed: false,
						title: {
							enabled: true,
							text: 'SACI',
							align: 'high'
						},
						labels: {
							formatter: function() {
								return this.value +'';
							}
						},
						maxPadding: 0.05,
						//showLastLabel: true,
						min : 0,
						max : <?php echo $maxheight;?>
					},
					yAxis: {
						title: {
							text: 'PI + t',
							align: 'high'
						},
						labels: {
							formatter: function() {
								return this.value + '';
							}
						},
						lineWidth: 2,
						gridLineWidth: 0,
						min : <?php echo $policy_incepted;?>,
						gridLineDashStyle:'ShortDash',
						minorGridLineDashStyle: 'Solid',
						minorGridLineWidth: 1,
						plotLines: [{
			                value: <?php echo $row["maturity_year"];?>,
			                width: 1,
			                color: 'green',
			                dashStyle: 'dash',
			                label: {
			                    //text: 'Latest value',
			                    align: 'right',
			                    y: 12,
			                    x: 0
			                }
			            }]
					},
					legend: {
						enabled: false
					},
					tooltip: {
						formatter: function() {
							return ''+
								this.y +' / '+ this.x +'';
						}
					},
					plotOptions: {
						spline: {
							marker: {
								enable: false
							}
						}
					},
					series: [{
						name: 'Temperature',
						data: [[<?php echo $row["sum_assured_critical_illness"];?>, <?php echo $policy_incepted;?>], [<?php echo $row["sum_assured_critical_illness"];?>, <?php echo $pit;?>]]
					}]
				});

				chart4 = new Highcharts.Chart({
					chart: {
						renderTo: 'chart4',
						defaultSeriesType: 'spline',
						inverted: true,
						width: 400,
						style: {
							//margin: '0 auto'
						}
					},
					title: {
						text: 'Retirement'
					},
					subtitle: {
						//text: 'According to the Standard Atmosphere Model'
					},
					xAxis: {
						reversed: false,
						title: {
							enabled: true,
							text: 'MV',
							align: 'high'
						},
						labels: {
							formatter: function() {
								return this.value +'';
							}
						},
						maxPadding: 0.05,
						//showLastLabel: true,
						min : 0,
						gridLineWidth: 0,
						plotLines: [{
			                value: <?php echo $row["maturity_value"];?>,
			                width: 1,
			                color: 'green',
			                dashStyle: 'dash',
			                label: {
			                    //text: 'Latest value',
			                    align: 'right',
			                    y: 12,
			                    x: 0
			                }
			            }]
					},
					yAxis: {
						title: {
							text: 'MY',
							//align: 'slow',
							//margin-left : 80
						},
						labels: {
							formatter: function() {
								return this.value + '';
							}
						},
						lineWidth: 2,
						min : <?php echo $policy_incepted;?>,
						max : <?php echo $row["maturity_year"]+20;?>,
						gridLineWidth: 0,
						plotLines: [{
			                value: <?php echo $row["maturity_year"];?>,
			                width: 1,
			                color: 'green',
			                dashStyle: 'dash',
			                label: {
			                    //text: 'Latest value',
			                    align: 'right',
			                    y: 12,
			                    x: 0
			                }
			            }]
					},
					legend: {
						enabled: false
					},
					tooltip: {
						formatter: function() {
							return ''+
								this.y +' / '+ this.x +'';
						}
					},
					plotOptions: {
						spline: {
							marker: {
								enable: false
							}
						}
					},
					series: [{
						name: 'Temperature',
						data: [[<?php echo $row["maturity_value"];?>, <?php echo $row["maturity_year"];?>],[<?php echo $row["maturity_value"];?>,<?php echo $row["maturity_year"]+20;?>]]
					}]
				});
				
			});
				
		</script>
		<!-- 3. Add the container -->
		<div>Existing coverage <?php echo $param?></div>
		<table>
			<tr>
				<td><div id="container1" style="width: 400px; height: 400px; margin: 0 auto"></div></td>
				<td><div id="container2" style="width: 400px; height: 400px; margin: 0 auto"></div></td>
				
			</tr>
			
			<tr>
				<td style="vertical-align: bottom;"><div id="container3" style="width: 400px; height: 400px; margin: 0 auto"></div></td>
				<?php 
				if($row["maturity_value"] > 0 && $row["maturity_year"] > $row["policy_incepted"]):
				?>
				<td style="vertical-align: bottom;">
				<div id="chart4" style="width: 400px; height: 400px; margin: 0 auto"></div>
				< td>
				<?php 
				endif;
				?>
			</tr>
			
		</table>
		